<template>
	<ynet-content id="operateMain" :headerInformation="true" :headerMenu="true">
		<div class="main-container">
			<ynet-breadcrumb></ynet-breadcrumb>
		</div>
		<div class="main-container lrb pt10" v-if="main">
			<div>
				<el-form ref="queryForm" :model="queryForm" class="formEmbedTable mt20" :rules="rules" >
					<table>
						<caption>Enquiry</caption>
						<tr>
							<td>Primary A/C No.</td>
							<td>
								<el-form-item prop="TBSNo">
									<el-input v-model="queryForm.TBSNo" ></el-input>
								</el-form-item>
							</td>
						</tr>
					</table>
				</el-form>
			</div>
			<div class="btnArea mt10 tac">
				<el-button type="primary" @click="queryOperate">Search</el-button>
			</div>
            
			<div class="NotFound" v-bind:class="{ showInfo: isFind}">
			   No Data
			</div>
            <!-- 客户信息显示界面-->
			<div v-bind:class="{ showInfo:isActive }" >
				<el-form ref="resultForm" :model="resultForm" class="formEmbedTable mt10">
					<table>
						<caption>Result</caption>
						<tr>
							<td>Customer Name</td>
							<td>
								<el-form-item prop="CustName">
									<el-input readonly="readonly" v-model="resultForm.CustName" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
							<td>Authorized Person</td>
							<td>
								<el-form-item prop="AuthMan">
									<el-input readonly="readonly" v-model="resultForm.AuthMan" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
						</tr>

					</table>
					
                    
                    <!--地址信息-->
                    <table>
						 <tr>
					    <td>A/C Address</td>
						<td>
							<el-form-item prop="ACAddress1">
									1. <el-input readonly="readonly" v-model="resultForm.ACAddress1" style="width: 600px;" ></el-input>
							</el-form-item>
							<br>
							<el-form-item prop="ACAddress2">
									2. <el-input readonly="readonly" v-model="resultForm.ACAddress2" style="width: 600px;"></el-input>
							</el-form-item>
							<br>
							<el-form-item prop="ACAddress3">
									3. <el-input readonly="readonly" v-model="resultForm.ACAddress3" style="width: 600px;"></el-input>
							</el-form-item>
							<br>
							<el-form-item prop="ACAddress4" >
									4. <el-input readonly="readonly" v-model="resultForm.ACAddress4" style="width: 600px;"></el-input>
							</el-form-item>
						</td>
				    </tr>
				     
					</table>
                    
                    
					<table>
						<tr>
							<td>ADDR.COUNTRY</td>
							<td>
								<el-form-item prop="AddrCountry">
									<el-input readonly="readonly" v-model="resultForm.AddrCountry" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
							
						</tr>
						</table>
						<table>
                        <tr>
							<td>TBS A/C Status</td>
							<td>
								<el-form-item prop="ACstatus">
									<el-input readonly="readonly" v-model="resultForm.ACstatus" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
							<td>TBS A/C Last Update Date</td>
							<td>
								<el-form-item prop="UpdateDate">
									<el-input readonly="readonly" v-model="resultForm.UpdateDate" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
						</tr>
						 <tr>
							<td>TBS A/C Last Transaction Date</td>
							<td>
								<el-form-item prop="TranDate">
									<el-input readonly="readonly" v-model="resultForm.TranDate" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
							<td>TBS A/C Last Open Date</td>
							<td>
								<el-form-item prop="OpenDate">
									<el-input readonly="readonly" v-model="resultForm.OpenDate" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
						</tr>
						 <tr>
							<td>PIN ERR COUNT</td>
							<td>
								<el-form-item prop="errorCount">
									<el-input readonly="readonly" v-model="resultForm.errorCount" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
							<td>PIN Last Update Date</td>
							<td>
								<el-form-item prop="PinUpdateDate">
									<el-input readonly="readonly" v-model="resultForm.PinUpdateDate" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
						</tr>
						<tr>
							<td>PIN Status</td>
							<td>
								<el-form-item prop="PinStatus">
									<el-input readonly="readonly" v-model="resultForm.PinStatus" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
							<td>PIN Generation Status</td>
							<td>
								<el-form-item prop="PinGenerationStatus">
									<el-input readonly="readonly" v-model="resultForm.PinGenerationStatus" @focus="cleanOther()"></el-input>
								</el-form-item>
							</td>
						</tr>
					</table>
					<div class="fourForm tableForm mt20 tableData">
                <el-table :data="TBStranlist"  >
                    <el-table-column prop="BankACNo" label="Bank A/C No." align="center">
                    </el-table-column>
                </el-table>
                <el-table :data="Fixedlist"  >
                    <el-table-column prop="FixedACNo" label="Fixed Deposit A/C No." align="center"></el-table-column>
                </el-table>

            </div>
				</el-form>
			</div>

		</div>
		<!--授权确认页面弹窗-->
		<div>
			<ynet-authDialog ref="dialogTable" @getAuthForm="getAuthForm"></ynet-authDialog>
		</div>
	</ynet-content>
</template>

<script>
	export default {
		name: 'operateMain',
		components: {},
		data() {
			return {
				queryForm: {
					TBSNo: '',
				},
				resultForm: {
					CustName: '',
					AuthMan:'',
					ACAddress1:'',
					ACAddress2:'',
					ACAddress3:'',
					ACAddress4:'',
					AddrCountry:'',
					ACstatus:'',
					UpdateDate:'',
					TranDate:'',
					OpenDate:'',
					errorCount:'',
					PinUpdateDate:'',
					PinStatus:'',
					PinGenerationStatus:'',
				},
				rules: {
					TBSNo: [
                    { required: true, message: 'required', trigger: 'blur' },
                    { validator: this.$tools.validator.isInteger, trigger: 'blur' },
                    ]
				},
				tableData: [],
				isAdd: false,
				isDetail: false,
				isEdit: false,
				isActive:true,
				isFind:true,
				main: true,
				TBStranlist: [], //从后台查询的操作员信息数组
				Fixedlist:[],
				operInfoDetail: {},
				selectData: [],
				rePwd: {
					actionFlag: '1',
					bsnCode: 'IM0105',
					imUserInfoList: [],
				},
				delForm: {
					stt: '3',
					actionType: '2',
					imUserInfoList: [],
					bsnCode: 'IM0103',
					userNo: '0000000'
				},
				actionType: [], //删除还是重置密码
				dialogTableVisible: false,
				authForm: {
					authUserNo: '',
					password: '',
					randomField: ''
				}, //授权数据
				needAuth: '',
				authType: '',
			}

		},
		methods: {
			backMain() {
				this.selectData = [];
				this.operInfoDetail = {};
				this.queryOperate();
				this.main = true;
				this.isAdd = false;
				this.isDetail = false;
				this.isEdit = false;
			},
			getAuthForm(val) {
				//获取授权数据
				this.authForm = val;
				console.log("val:" + JSON.stringify(val))
				this.delForm = $.extend({}, this.delForm, this.authForm)
				this.delOper() //自己页面提交给后台的.do方法
			},
			queryAuth(formName) { //查询授权模式
				if(this.selectData.length != 0) {
					let body = {};
					body.bsnCode = "IM0103";
					body.version = "IM0103",
						this.$tools.request(this, "IM010001Action.do", body).then(data => {
							//console.log("authData:"+JSON.stringify(data))
							if(data.body.errorCode == 0) {
								if(data.body.needAuth == 0) { //无需授权
									this.delOper()
								} else if(data.body.needAuth == 1 && data.body.authType == 1) {
									this.needAuth = 1;
									this.authType = 1;
									this.$refs["dialogTable"].show()
								} else if(data.body.needAuth == 1 && data.body.authType == 2) {
									this.needAuth = 1;
									this.authType = 2;
									this.delOper()
								} else {
									this.$alert('Authorization type error', 'warning', {
										confirmButtonText: 'Confirm',
										callback: action => {}
									});
								}
							} else {
								this.$alert("System Error Try again", "warning", {
									confirmButtonText: 'Confirm',
									callback: action => {}
								})
							}

						})
				} else {
					this.$alert('select data', 'warning', {
						confirmButtonText: 'Confirm',
						callback: action => {}
					});
				}
			},
			delOper() { //删除操作员
				this.delForm.imUserInfoList = this.selectData;
				//console.log("delForm:"+JSON.stringify(this.delForm))
				this.$tools.request(this, "IM010302Action.do", this.delForm).then(data => {
					//console.log("data:"+JSON.stringify(data))
					if(data.body.errorCode == 0) {
						this.queryOperate()
						if(this.needAuth == 1 && this.authType == 2) {
							this.$message({
								type:'success',
								message:'Waiting for Authorized',
							})
							
							
						}else if(this.needAuth==1 && this.authType==1){
							if(data.body.authStatus==1){
                                this.$message.error({
                                     message:'Authorship No. or password wrong ,please resume load',
                                    showClose:true,
                                })
                            }else{
                                this.$message({
                                    type:'success',
                                    message:'Add Success',
                                    showClose:true,
                                })
                            }
						} else {
							this.$message({
                                    type:'success',
                                    message:'Success',
                                    showClose:true,
                                })
						}
					} else {
						this.$alert("System Error Try again", "warning",{
							confirmButtonText: 'Confirm',
							callback: action => {}
						})
					}
				})
			},

			resetForm(formName) { //清空
				this.$refs[formName].resetFields();
				this.tableData = [];
			},
			openDetail(val) {
				//点击客户号显示详情
				for(let i = 0; i < this.TBStranlist.length; i++) {
					if(this.TBStranlist[i].userNo == val) {
						this.operInfoDetail = this.TBStranlist[i];
						break;
					}
				}
				this.main = false;
				this.isDetail = true;
			},
			queryOperate() {
				/*if(this.queryForm.TBSNo ==''){
            		return;
            	}*/
				this.$refs.queryForm.validate((valid)=>{
                    //console.log("goingdown.....")
					if(valid){
                    this.$tools.request(this, "IM0404.do", this.queryForm).then(data => {
					if(data.body.errorCode == 0) {
						/*this.resultForm = data.body.TBStranlist;
						this.turnPageTotalNum = data.body.turnPageTotalNum;*/
						if(data.body.AccCustNameCH==''||data.body.AccCustNameCH==null){
                             this.isFind=false;
							 return;
						}else{
							 this.isFind=true;
						}
						this.resultForm.CustName = data.body.AccCustNameCH +" / "+ data.body.AccCustNameEN;
						this.resultForm.ACAddress1 = data.body.ACaddress1;
						this.resultForm.ACAddress2 = data.body.ACaddress2;
						this.resultForm.ACAddress3 = data.body.ACaddress3;
						this.resultForm.ACAddress4 = data.body.ACaddress4;
						this.resultForm.AddrCountry = data.body.AddrCountry;
						this.resultForm.TranDate = data.body.tranTime;
						this.resultForm.errorCount = data.body.PwdErrorCount;
						this.resultForm.PinUpdateDate = data.body.PwdUpdateDate;
						
						this.resultForm.AuthMan = data.body.PwdAuthPerson;
						this.TBStranlist = data.body.BankACNoList;
						this.Fixedlist = data.body.FixedACNoList;
						//console.log('this is the bankno data: '+data.body.FixedACNoList);
						if(data.body.AccState == "0"){
							this.resultForm.ACstatus = "Normal";
						}else if(data.body.AccState == "1"){
							this.resultForm.ACstatus = "Freeze";
						}else if(data.body.AccState == "2"){
							this.resultForm.ACstatus = "Release";
						}
						
						//this.resultForm.ACstatus = data.body.AccState;
						//this.resultForm.PinStatus =data.body.PwdState;
						if(data.body.PwdState == "0"){
							this.resultForm.PinStatus = "Normal";
						}else if(data.body.PwdState == "1"){
							this.resultForm.PinStatus = "Freeze";
						}else if(data.body.PwdState == "2"){
							this.resultForm.PinStatus = "Perpettual Freeze";
						}else if(data.body.PwdState == "3"){
							this.resultForm.PinStatus = "Need Reset";
						}
						
						this.resultForm.OpenDate = data.body.AccOpenDate;
						this.resultForm.UpdateDate = data.body.AccUpdateDate;
						this.isActive=false;   
						console.log(data.body);
					} else {
						this.$alert("System Error Try again", "warning", {
							confirmButtonText: 'Confirm',
							callback: action => {}
						})
					}
				})
					}
				})
				
			},
			operateAdd() {
				this.isAdd = true;
				this.main = false;
				this.isEdit = false;
				this.isDetail = false;
			},
			operEdit() {
				if(this.selectData.length != 1) {
					this.$alert("select data", "warning", {
						confirmButtonText: 'Confirm',
						callback: action => {}
					})
				} else {
					this.operInfoDetail = this.selectData[0];
					this.main = false;
					this.isAdd = false;
					this.isEdit = true;
				}
			},
			handleSelectChange(val) {
				this.selectData = val;
			},
			cleanOther() {
				let _this = this
				_this.$refs.queryForm.resetFields()
			},
			handleCurrentChange(val) { //分页方法
				this.queryForm.currentPage = val;
				this.queryOperate()
			},
		}
	}
</script>

<style>
  .showInfo{
	  display:none;
  }
  .NotFound{
	  text-align:center;
	  height:40px;
	  padding-top:20px;
	  margin-top:50px;
	  font-weight:20px;
	  border:1px solid #cbcbc9;
  }
</style>